import React from "react";
import styles from "./weixiuchanzhi-view.module.scss";
import icon1 from "./icon-1.png";
import icon2 from "./icon-2.png";
import XxtvCard from "../card/xxtv-card";
/**
 * 
 * @param {} param0 
 * @returns
 * @description 维修产值模块
 */
const XxweixiuChanzhiComponent = ({
    style = {},
    pushSpFee = 0, // 推修金额 配件金额
    pushWhFee = 0, // 推修金额 工时
    repairSpFee = 0, // 返修金额 配件金额
    repairWhFee = 0, // 返修金额 工时
    repairFeeRatio = 0, // 标的车损返修 金额
    repairCotRatio = 0, //  标的车损返修 台数
    sumVerilossCot = 0, // 标的车损核损 台数
    sumVerilossFee = 0, // 标的车损核损 金额
}) => {


    return (
        <>
            <XxtvCard title="维修产值（万元）">
                <div className={styles.center_box}>
                    <div className="background-box">
                        <hr className="hr" />
                        <hr className="hr hr2" />
                        <div className="crice1 crice-backColor">
                            <div className="crice">
                                <div className="crice " style={{ backgroundColor: "#050d29" }}>
                                    <span className="iconfont cont-icon changeColor">&#xe63e;</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div className="box-item">
                        <div className="box-item-content">
                            <div className="item-title">
                                <span className="icon">
                                    <img src={icon1} alt="" />
                                </span>
                                <span className="text">标的车损核损</span>
                            </div>
                            <div className="item-content">
                                <div className="con-item">
                                    <span className="value">{sumVerilossCot}</span>
                                    <span className="label">台数</span>
                                </div>
                                <div className="con-item">
                                    <span className="value">{sumVerilossFee}</span>
                                    <span className="label">金额</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div className="box-item">
                        <div className="box-item-content">
                            <div className="item-title right">
                                <span className="icon">
                                    <img src={icon1} alt="" />
                                </span>
                                <span className="text">标的车损返修（%）</span>
                            </div>
                            <div className="item-content">
                                <div className="con-item">
                                    <span className="value">{repairCotRatio}</span>
                                    <span className="label">台数</span>
                                </div>
                                <div className="con-item">
                                    <span className="value">{repairFeeRatio}</span>
                                    <span className="label">金额</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div className="box-item">
                        <div className="box-item-content">
                            <div className="item-title">
                                <span className="icon">
                                    <img src={icon2} alt="" />
                                </span>
                                <span className="text">返修金额</span>
                            </div>
                            <div className="item-content">
                                <div className="con-item">
                                    <span className="value">{repairWhFee}</span>
                                    <span className="label">工时</span>
                                </div>
                                <div className="con-item">
                                    <span className="value">{repairSpFee}</span>
                                    <span className="label">配件金额</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div className="box-item">
                        <div className="box-item-content">
                            <div className="item-title right">
                                <span className="icon">
                                    <img src={icon2} alt="" />
                                </span>
                                <span className="text">推修金额</span>
                            </div>
                            <div className="item-content">
                                <div className="con-item">
                                    <span className="value">{pushWhFee}</span>
                                    <span className="label">工时</span>
                                </div>
                                <div className="con-item">
                                    <span className="value">{pushSpFee}</span>
                                    <span className="label">配件金额</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </XxtvCard>
        </>
    )
}
export default XxweixiuChanzhiComponent